/*
 * @Author: liu.lin liu.lin@hzleaper.com
 * @Date: 2023-11-15 13:43:50
 * @LastEditors: liu.lin liu.lin@hzleaper.com
 * @LastEditTime: 2023-11-24 17:03:30
 * @FilePath: \aoi_link_frontend\src\page\line-yield-analyse\index.tsx
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AEimp
 */

import { FC, useEffect, useState } from 'react';
import LineYieldAnalyseHeader from './component/Header';
import LineYieldAnalyseEchart from './component/Echart';
import LineYieldAnalyseTable from './component/Table';
import { getFpyConfig } from '@/api/config/index';
import { exportData, getQueryline } from '@/api/line-yield-analyse/index';
import { CascaderOptionType, YieldDatastType } from './index.type';
import { ParamsType } from './component/Header/index.type';

// 这个页面根据业务来自行设计吧
const LineYieldAnalyse: FC = () => {
  const [factoryOptions, setFactoryOptions] = useState<CascaderOptionType[]>([]); //线体的选择框
  const [yieldDatas, setYieldDatas] = useState<YieldDatastType[]>([]); //这是数据

  useEffect(() => {
    getConfig();
    // getTimeFactory();
  }, []);

  /**
   * @description: 获取config
   * @return {*}
   */
  const getConfig = async () => {
    try {
      const res = await getFpyConfig();
      if (res.code === 200) {
        const { factorySummury } = res.data;
        const options = handlecascaderData(factorySummury);
        setFactoryOptions(options);
      }
    } catch (error) {
      console.log(`error`, error);
    }
  };

  /**
   * @description: 整理级联参数
   * @param {*} cascaderData
   * @param {factory} label
   * @param {factory} children
   * @return {*}
   */
  const handlecascaderData = cascaderData => {
    const cascaderDatas = cascaderData.map(factory => {
      return {
        value: factory.key,
        label: factory.factoryName,
        children: factory.children.map(line => ({ value: line, label: line }))
      };
    });

    return cascaderDatas;
  };

  /**
   * @description: 查询方法
   * @param {ParamsType} params
   * @return {*}
   */
  const handleSearch = async (params: ParamsType) => {
    try {
      const res = await getQueryline(params);
      if (res.code === 200) {
        console.log(`res`, res);
        const { data } = res;
        setYieldDatas(data);
      }
    } catch (error) {}
  };

  /**
   * @description: 获取默认时间和线体参数
   * @param {ParamsType} param
   * @return {*}
   */
  const getTimeFactory = async (params: ParamsType) => {
    try {
      const res = await getQueryline(params);
      if (res.code === 200) {
        const { data } = res;
        console.log(`res`, res);

        setYieldDatas(data);
      }
    } catch (error) {}
  };

  /**
   * @description: 导出
   * @return {*}
   */
  const handleExport = async (params: ParamsType) => {
    const res = await exportData(params);
    console.log(`res`, res);
  };

  return (
    <div className="line_yield_analyse">
      <div className="line_yield_analyse_header">
        <LineYieldAnalyseHeader factoryOptions={factoryOptions} handleSearch={handleSearch} handleExport={handleExport} getTimeFactory={getTimeFactory} />
      </div>
      <div className="line_yield_analyse_content">
        <LineYieldAnalyseEchart dataSource={yieldDatas} />
        <LineYieldAnalyseTable />
      </div>
    </div>
  );
};
export default LineYieldAnalyse;
